<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core" 
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <h:body>
        <ui:composition template="layout.xhtml">
            <ui:define name="tituloJanela">
                ARTIGOS ESPORTIVOS :: AE-Store
            </ui:define>
            <ui:define name="conteudo">
                <div id="content">


                    <br/> 
                    <div id="galeria">
                        <p:galleria value="#{galleriaBean.images}" var="image">                         

                            <p:graphicImage value="#{image}" />   
                        </p:galleria>
                    </div>

                    <br/>


                    <div class="top"></div>
                    <!-- Begin Inner -->
                    <div class="inner">
                        <div id="products">
                            <h2>Newest Models</h2>
                            <!-- Begin Row -->
                            <div class="row">
                                <div class="product">
                                    <div class="img-box">
                                        <div class="box-frame"> </div>
                                        <img src="css/images/product-img1.jpg" alt="Product Image" />
                                        <a href="#" class="more" title="View More">View More</a>
                                    </div>
                                    <div class="pr-entry">
                                        <h4>Model name</h4>
                                        <span class="pr-number">Product: 12</span>
                                        <p>Nunc et eros felis. Donec ullamcorper faucibus lectus, dictum eleifend justo eleif-end non. Mauris venenatis lorem tincidunt neque imperdiet molestie sit amet dictum purus.</p>
                                        <span class="pr-price"><span>$</span>1999<sup>.99</sup></span>
                                    </div>
                                    <div class="product">
                                        <div class="img-box">
                                            <div class="box-frame"> </div>
                                            <img src="css/images/product-img2.jpg" alt="Product Image" />
                                            <a href="#" class="more" title="View More">View More</a>
                                        </div>
                                        <div class="pr-entry">
                                            <h4>Model name</h4>
                                            <span class="pr-number">Product: 24</span>
                                            <p>Nunc et eros felis. Donec ullamcorper faucibus lectus, dictum eleifend justo eleif-end non. Mauris venenatis lorem tincidunt neque imperdiet molestie sit amet dictum purus.</p>
                                            <span class="pr-price"><span>$</span>1399<sup>.99</sup></span>
                                        </div>
                                    </div>
                                    <div class="product pr-last">
                                        <div class="img-box">
                                            <div class="box-frame"> </div>
                                            <img src="css/images/product-img3.jpg" alt="Product Image" />
                                            <a href="#" class="more" title="View More">View More</a>
                                        </div>
                                        <div class="pr-entry">
                                            <h4>Model name</h4>
                                            <span class="pr-number">Product: 33</span>
                                            <p>Nunc et eros felis. Donec ullamcorper faucibus lectus, dictum eleifend justo eleif-end non. Mauris venenatis lorem tincidunt neque imperdiet molestie sit amet dictum purus.</p>
                                            <span class="pr-price"><span>$</span>1299<sup>.99</sup></span>
                                        </div>
                                    </div>
                                    <div class="cl"> </div>
                                </div>
                                <!-- End Row -->
                                <!-- Begin Row -->
                                <div class="row last">
                                    <div class="product">
                                        <div class="img-box">
                                            <div class="box-frame"> </div>
                                            <img src="css/images/product-img4.jpg" alt="Product Image" />
                                            <a href="#" class="more" title="View More">View More</a>
                                        </div>
                                        <div class="pr-entry">
                                            <h4>Model name</h4>
                                            <span class="pr-number">Product: 41</span>
                                            <p>Nunc et eros felis. Donec ullamcorper faucibus lectus, dictum eleifend justo eleif-end non. Mauris venenatis lorem tincidunt neque imperdiet molestie sit amet dictum purus.</p>
                                            <span class="pr-price"><span>$</span>2999<sup>.99</sup></span>
                                        </div>
                                    </div>
                                    <div class="product">
                                        <div class="img-box">
                                            <div class="box-frame"> </div>
                                            <img src="css/images/product-img5.jpg" alt="Product Image" />
                                            <a href="#" class="more" title="View More">View More</a>
                                        </div>
                                        <div class="pr-entry">
                                            <h4>Model name</h4>
                                            <span class="pr-number">Product: 2</span>
                                            <p>Nunc et eros felis. Donec ullamcorper faucibus lectus, dictum eleifend justo eleif-end non. Mauris venenatis lorem tincidunt neque imperdiet molestie sit amet dictum purus.</p>
                                            <span class="pr-price"><span>$</span>3999<sup>.99</sup></span>
                                        </div>
                                    </div>
                                    <div class="product pr-last">
                                        <div class="img-box">
                                            <div class="box-frame"> </div>
                                            <img src="css/images/product-img6.jpg" alt="Product Image" />
                                            <a href="#" class="more" title="View More">View More</a>
                                        </div>
                                        <div class="pr-entry">
                                            <h4>Model name</h4>
                                            <span class="pr-number">Product: 9</span>
                                            <p>Nunc et eros felis. Donec ullamcorper faucibus lectus, dictum eleifend justo eleif-end non. Mauris venenatis lorem tincidunt neque imperdiet molestie sit amet dictum purus.</p>
                                            <span class="pr-price"><span>$</span>1599<sup>.99</sup></span>
                                        </div>
                                    </div>
                                    <div class="cl"> </div>
                                </div>
                                <!-- End Row -->
                            </div>
                        </div>
                        <!-- End Inner -->
                    </div>
                </div>
            </ui:define>

        </ui:composition>

    </h:body>
</html>
